<template>
  <div class="cart">
    <div
      class="cart-list"
      v-for="item in $store.state.cart"
      :key="item.id"
    >
      <div class="cart-l">
        <van-switch v-model="item.selected" />
      </div>
      <div class="cart-r">
        <van-card
          :num="item.count"
          :price="item.price+'.00'"
          :title="item.title"
          :thumb="item.src"
        >
          <template #desc>
            <van-stepper v-model="item.count" />
          </template>
        </van-card>
      </div>
    </div>

    <van-submit-bar
      :price="$store.getters.getAllPrice*100"
      button-text="提交订单"
    />
  </div>
</template>
<script>
export default {
  data: () => ({
    check: true,
    value: 2
  })
}
</script>
<style lang="less" scoped>
.cart {
  padding: 10px;
  .cart-list {
    display: flex;
    .cart-l {
      flex: 1;
      display: flex;
      justify-content: center;
      align-items: center;
    }
    .cart-r {
      flex: 2;
    }
  }
  .van-stepper {
    margin-top: 10px;
  }
}
</style>
